
.case_box{ background: #f8f9fb;}
.project_banner{background-size: 100% 100%!important;width: 100%;height: calc(51vw + 1.01rem);max-height: 65vh;overflow-y: hidden;position: relative}
.project_banner img{width: 100%; position: absolute;
  height: calc(51vw + 1.01rem);
  min-height: 5.5rem;
  max-height: 65vh;
  overflow-y: hidden;
  object-position: center;
  object-fit: cover;}
.project_banner_con{width: 1200px; margin: 0 auto; margin-top: 16%;}
.project_main{width: 1200px; margin: 50px auto;background: #f8f8f8;}
.project_main .project_con{width: 960px; float: left; min-height: 471px;}
.project_main .project_con .portfolio{float: left; width: 50%; margin-bottom: 30px;padding:0 10px;}
.project_main .project_con .portfolio .project_con_list{ height: 127px; background: #fff; position: relative; padding-left: 130px; box-shadow: 0 5px 10px #dee0e4; -webkit-box-shadow: 0 5px 10px #dee0e4; -o-box-shadow: 0 5px 10px #dee0e4; -ms-box-shadow: 0 5px 10px #dee0e4; -moz-box-shadow: 0 5px 10px #dee0e4;}
.project_main .project_con .portfolio .project_con_list img{position: absolute; left: 15px; width: 80px; height: 80px;}
.project_main .project_con .portfolio .project_con_list span{color: #373d41; width: 100%; height: 21px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}
.project_main .project_con .portfolio .project_con_list p{line-height: 22px; height: 66px; color: #a9b0b4; display: -webkit-box; text-overflow:ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
.project_main .project_con .portfolio a:hover span{color: #3c8cff;}
.project_con_nav{float: right;width: 160px;}
.project_con_nav li{background: #fff; width: 160px; margin-bottom: 15px; line-height: 20px;}
.project_con_nav li .filter{display:block; padding: 12px 0 12px 20px;cursor: pointer;}
.project_con_nav li .span{line-height: 20px;}
.project_con_nav li .filter.active{color: #3c8cff;}
.project_con_nav li .icon_project{display: inline-block;width: 24px;height: 20px;position: relative;top: 2px;}
.project_con_nav li .icon-tab{height: 1.35rem}
.project_con_nav li:nth-of-type(5) .icon-tab{height: 1rem}
.project_con_nav li:nth-of-type(6) .icon-tab{height: 0.9rem}
.project_con_nav li:nth-of-type(7) .icon-tab{height: 1.25rem}
/*
.project_con_nav li:nth-of-type(1) .icon_project{background: url(@/assets/images/project_app_01.png) center no-repeat;}
.project_con_nav li:nth-of-type(2) .icon_project{background: url(@/assets/images/project_app_02.png) center no-repeat;}
.project_con_nav li:nth-of-type(3) .icon_project{background: url(@/assets/images/project_app_03.png) center no-repeat;}
.project_con_nav li:nth-of-type(4) .icon_project{background: url(@/assets/images/project_app_04.png) center no-repeat;}
.project_con_nav li:nth-of-type(5) .icon_project{background: url(@/assets/images/project_app_05.png) center no-repeat;}
.project_con_nav li:nth-of-type(6) .icon_project{background: url(@/assets/images/project_app_06.png) center no-repeat;}
.project_con_nav li:nth-of-type(7) .icon_project{background: url(@/assets/images/project_app_07.png) center no-repeat;background-size: 22px 20px;}
.project_con_nav li:nth-of-type(1) .filter.active .icon_project{background: url(@/assets/images/project_app_01a.png) center no-repeat;}
.project_con_nav li:nth-of-type(2) .filter.active .icon_project{background: url(@/assets/images/project_app_02a.png) center no-repeat;}
.project_con_nav li:nth-of-type(3) .filter.active .icon_project{background: url(@/assets/images/project_app_03a.png) center no-repeat;}
.project_con_nav li:nth-of-type(4) .filter.active .icon_project{background: url(@/assets/images/project_app_04a.png) center no-repeat;}
.project_con_nav li:nth-of-type(5) .filter.active .icon_project{background: url(@/assets/images/project_app_05a.png) center no-repeat;}
.project_con_nav li:nth-of-type(6) .filter.active .icon_project{background: url(@/assets/images/project_app_06a.png) center no-repeat;}
.project_con_nav li:nth-of-type(7) .filter.active .icon_project{background: url(@/assets/images/project_app_07a.png) center no-repeat;background-size: 22px 20px;}
*/



.serviced_case{width: 1200px; margin: 0 auto;}
.serviced_case ul li{width: 20%; height: 330px; float: left; text-align: center;cursor:pointer}
.serviced_case .case_box{ position: relative; height: 330px;}
.serviced_case .case_box img{height: 60px; width: auto;}
.serviced_case ul li p{color: #a9b0b4;height:76px; display: -webkit-box; text-overflow:ellipsis; -webkit-box-orient: vertical;-webkit-line-clamp: 4; overflow: hidden;}
.serviced_case_box{position: absolute; top: 0; left: 0; width: 100%; height: 17px; overflow:hidden;border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; -ms-border-radius: 5px 5px 0 0; -o-border-radius: 5px 5px 0 0; transition: 0.5s;-moz-transition: 0.5s;-ms-transition: 0.5s;-o-transition: 0.5s;-moz-transition: 0.5s;}
